.Goods {
    display: flex;
    flex-direction: column;
    justify-content: space-between;

    .Goods-pic,
    .Goods-des,
    .Goods-name,
    .Goods-author {
        width: 100%;
        height: 10%;
        @include flex-between;
    }

    .warn,
    .success,
    .error {
        width: 5rem;
        padding: 0.125rem 0 0.125rem 0.625rem;
        border-radius: 0.375rem;
        color: #fff;
    }

    .warn {

        background-color: $warn-color;
    }

    .success {
        background-color: $success-color;
    }

    .error {
        background-color: $error-color;
    }

    .Goods-pic {
        height: 67%;
        cursor: pointer;
        position: relative;

        img {
            width: 100%;
            height: 100%;
        }
    }

    .isMuchMange {
        position: absolute;
        display: inline-block;
        width: 100%;
        height: 100%;
        box-sizing: border-box;
        background: linear-gradient(45deg, rgba(0, 0, 0, .3) 0%, rgba(10, 0, 0, .3) 90%, rgba(144, 144, 144, .7) 90%, rgba(144, 144, 144, .7) 100%);

        &:hover {
            background: linear-gradient(45deg, rgba(0, 0, 0, .3) 0%, rgba(10, 0, 0, .3) 90%, $theme-rgba-8 90%, $theme-rgba-8 100%);
        }

        &::after {
            content: '√';
            position: absolute;
            top: 0.125rem;
            right: 0.375rem;
        }
    }

    .Selected {
        box-shadow: 0 0 0 0.3125rem $theme-rgba-8 inset;
        background: linear-gradient(45deg, rgba(0, 0, 0, .3) 0%, rgba(10, 0, 0, .3) 90%, $theme-rgba-8 90%, $theme-rgba-8 100%);

        &::after {
            color: #fff;
        }
    }

    .Goods-des {
        .des-oringe {
            font-size: 1.125rem;
            font-weight: bold;
            color: $money-color;
        }

        .des-grey {
            display: flex;
            font-size: 0.875rem;
            color: $des-color;

            div {
                padding-right: 0.4375rem;
                cursor: pointer;

                i {
                    padding-right: 0.1875rem;
                }

                &:hover {
                    i {
                        color: $theme-rgba-7;
                    }
                }
            }
        }
    }

    .Goods-author {
        .author {
            cursor: pointer;
            font-size: 0.9375rem;
            color: $des-color;

            &:hover {
                text-decoration: underline;
                color: $theme-color;
            }
        }

        i {
            cursor: pointer;
            color: $theme-color;
            font-size: 1.25rem;
        }
    }
}

@media screen and (max-width: 1366px){
    .Goods{
        width: 11.7vw!important;
        .Goods-name{
            font-size: 0.875rem;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
        }
        .Goods-des{
            .des-oringe{
                font-size: 0.9375rem;
            }
        }
    }
}